<template>
  <yd-layout class="111111111111111" ref='scroller'>
    <!-- {{pullrefresh}} -->
    <!-- <yd-pullrefresh :callback='loadList1' ref='prdemo' v-if='pullrefresh'>
      <yd-list slot='list'>
        <slot></slot>
      </yd-list>
    </yd-pullrefresh> -->
    <!-- <div> -->
    <!-- <yd-infinitescroll :callback='loadList2' ref='lsdemo'>
      <yd-list slot='list'>
        <slot></slot>
      </yd-list>
      <span slot='doneTip'>啦啦啦，啦啦啦，没有数据啦~~</span>
    </yd-infinitescroll> -->
    <!-- </div> -->

    <!-- <yd-pullrefresh :callback='loadList1' ref='prdemo'> -->
    <yd-infinitescroll :callback='loadList2' ref='lsdemo'>
      <yd-list slot='list' @touchmove='touchmove($event)' class="2222222222222">
        <slot></slot>
      </yd-list>
      <span slot='doneTip'>啦啦啦，啦啦啦，没有数据啦~~</span>
    </yd-infinitescroll>
    <!-- </yd-pullrefresh> -->
    <!-- <yd-backtop></yd-backtop> -->
  </yd-layout>
</template>
<script type='text/babel'>
export default {
  props: {
    value: {
      type: Object,
      default: {
        current: 1,
        total: 20,
        pageSize: 10
      }
    },
    pullrefresh: {
      type: Boolean,
      default: false
    },
    pullUp: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      pagingData: {
        current: 1,
        total: 20,
        pageSize: 10
      },
      scrollTop: 0
    }
  },
  watch: {
    pagingData(v) {
      this.$emit('input', v)
    },
    value(v) {
      this.pagingData = v
    }
  },
  methods: {
    loadList1() {
      // this.list = [12, 3, 4, 5, 6];
      // this.$dialog.toast({
      //   mes: this.list.length > 0 ? '为您更新了 条内容' : '已是最新内容'
      // });
      // this.$refs.prdemo.$emit('ydui.pullrefresh.finishLoad');
      this.$emit('fresh')
    },
    loadList2() {
      // this.$refs.lsdemo.$emit('ydui.infinitescroll.finishLoad');
      this.$emit('loadMore')
    },
    finishLoad() {
      this.$refs.lsdemo.$emit('ydui.infinitescroll.finishLoad');
    },
    touchmove(e) {
      console.log(e)
    }
  },
  mounted() {
    this.$nextTick(() => {
      var _this = this;
      this.scroller = document.getElementById('scrollView')
      this.fn = function (e) {
        this.movePageY = e.changedTouches[0].pageY
        this.disY = this.movePageY - this.startPageY
        if (_this.scroller.scrollTop <= 0 && this.disY >= 0) {
          preventDefault(e)
        }
      }
      this.start = function (e) {
        this.startPageY = e.changedTouches[0].pageY
        this.oldY = 0
      }
      document.addEventListener('touchstart', this.start)
      document.addEventListener('touchmove', this.fn)
      function preventDefault(e) {
        if (e && e.preventDefault) {
          e.preventDefault()
        } else {
          window.event.returnValue = false
        }
      }
    })
  },
  beforeDestroy() {
    document.removeEventListener('touchstart', this.start)
    document.removeEventListener('touchmove', this.fn)
  }
}
</script>
